<!--
* @Authoer: liuhua
* @Description: 交易信息展示
* @Date 2018年4月18日10:12:16
* @Modified By:
-->
<div>
    <div id="tradeRespMsg">

        <el-tabs type="border-card" @tab-click="tabClick">


            <el-tab-pane label="全量字段">
                <div>
                    <el-button type="primary" @click="saveTel">保存模板</el-button>
                </div>

                <div>报文结构变更记录</div>
                <el-table-x ref="reqMsgChgTable" :checkbox="true" :data-url="reqMsgChgUrl" :row-index="true"
                            :base-params="baseParam"
                            :table-columns="reqMsgChgColumns">
                </el-table-x>

                <div>报文字段展示</div>
                <el-table ref="commonTable" :data="data" :row-style="rowShowControl" @selection-change="changeFun"
                          stripe border fit highlight-current-row element-loading-text="加载中...">
                    <el-table-column @selection-change="changeFun"
                                     type="index"
                                     width="50">
                    </el-table-column>
                    <el-table-column
                            type="selection"
                            width="45">
                    </el-table-column>
                    <el-table-column label="字段名称" width="260">
                        <template scope="scope">
                            <span v-for="(space, levelIndex) in scope.row._level" class="ms-tree-space"></span>

                            <span v-if="rowHasChildren(scope.row)" @click="toggleChildrenShow(scope.row)">
                    <i v-if="!scope.row._expanded" class="el-tree-node__expand-icon" aria-hidden="true"></i>
                    <i v-if="scope.row._expanded" class="el-tree-node__expand-icon expanded" aria-hidden="true"></i>
                </span>
                            <span v-else class="ms-tree-space"></span>
                            <span>{{scope.row.fldNm}}</span>
                        </template>

                    </el-table-column>
                    <el-table-column label="描述" width="150">
                        <template scope="scope">
                            <span>{{ scope.row.fldDesc }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="字段路径1" width="150">
                        <template scope="scope">
                            <span>{{ scope.row.path }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="父节点" width="150">
                        <template scope="scope">
                            <span>{{ scope.row.parNm }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="长度" width="150">
                        <template scope="scope">
                            <span>{{ scope.row.fldLen }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="是否必填" width="150">
                        <template scope="scope">
                            <span>{{ scope.row.isReq }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="默认值" width="150">
                        <template scope="scope">
                            <span>{{ scope.row.defVal }}</span>
                        </template>
                    </el-table-column>
                </el-table>
            </el-tab-pane>

            <el-tab-pane label="业务模板">
                <div>模板信息</div>
                <el-form-x :model="busTel" ref="busTel" :group-fields="busTelFields"
                           label-width="120px"></el-form-x>
                <div>模板字段</div>
                <el-table ref="commonTable1" :data="dataTmp" :row-style="rowShowControl" @selection-change="changeFun"
                          stripe border fit highlight-current-row element-loading-text="加载中...">
                    <el-table-column @selection-change="changeFun"
                                     type="index"
                                     width="50">
                    </el-table-column>
                    <el-table-column
                            type="selection"
                            width="45">
                    </el-table-column>
                    <el-table-column label="字段名称" width="260">
                        <template scope="scope">
                            <span v-for="(space, levelIndex) in scope.row._level" class="ms-tree-space"></span>

                            <span v-if="rowHasChildren(scope.row)" @click="toggleChildrenShow(scope.row)">
                    <i v-if="!scope.row._expanded" class="el-tree-node__expand-icon" aria-hidden="true"></i>
                    <i v-if="scope.row._expanded" class="el-tree-node__expand-icon expanded" aria-hidden="true"></i>
                </span>
                            <span v-else class="ms-tree-space"></span>
                            <span>{{scope.row.fldNm}}</span>
                        </template>

                    </el-table-column>
                    <el-table-column label="描述" width="150">
                        <template scope="scope">
                            <span>{{ scope.row.fldDesc }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="字段路径" width="150">
                        <template scope="scope">
                            <span>{{ scope.row.path }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="字段路径" width="150">
                        <template scope="scope">
                            <span>{{ scope.row.parNm }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="长度" width="150">
                        <template scope="scope">
                            <span>{{ scope.row.fldLen }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="是否必填" width="150">
                        <template scope="scope">
                            <span>{{ scope.row.isReq }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="默认值" width="150">
                        <template scope="scope">
                            <span>{{ scope.row.defVal }}</span>
                        </template>
                    </el-table-column>
                </el-table>

            </el-tab-pane>


        </el-tabs>
        <!--数据集弹出框-->


    </div>
</div>